{% extends "file_manager/base.html" %}

{% block content %}
<div class="container mt-4">
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h5 class="mb-0">音频预览: {{ file_name }}</h5>
            <a href="{% url 'download' file_path=file_path %}" class="btn btn-sm btn-primary">下载</a>
        </div>
        <div class="card-body">
            <p style="color:red">file_path: {{ file_path }} | 长度: {{ file_path|length }}</p>
            {% if file_path and file_path|length > 0 %}
                <audio controls style="width: 100%;">
                    <source src="{% url 'download' file_path=file_path %}" type="audio/{% if file_path|slice:'-4:' == '.mp3' %}mpeg{% elif file_path|slice:'-4:' == '.ogg' %}ogg{% elif file_path|slice:'-4:' == '.wav' %}wav{% elif file_path|slice:'-4:' == '.aac' %}aac{% elif file_path|slice:'-4:' == '.m4a' %}mp4{% else %}mpeg{% endif %}">
                    您的浏览器不支持音频播放
                </audio>
            {% else %}
                <p class="text-danger">音频路径无效</p>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}
